<!-- 月度产值 -->
<template>
  <div>
    <s-table
      bordered
      :scroll="{ x: 1000 }"
      ref="table"
      size="default"
      :rowKey="(record) => record.id"
      :columns="columns"
      :data="loadData"
      :alert="true"
      show-size-changer
      show-quick-jumper
      showPagination="auto"
    >
      <span slot="serial" slot-scope="text, record, index">{{ index + 1 }}</span>
      <span slot="action" slot-scope="text, record">
        <template>
          <a
            v-if="
              isDetails == 0 &&
              (record.planGrossOutput == null ||
                record.realGrossOutput == null ||
                record.authenticRightGrossOutput == null)
            "
            @click="handleRecord(record)"
            >录入产值</a
          >
        </template>
      </span>
    </s-table>

    <a-modal width="900px" v-model="visible" :title="titles">
      <template slot="footer">
        <a-button key="back" @click="handleCancel"> 取消 </a-button>
        <a-button key="submit" type="primary" @click="handleOk"> 再次确认 </a-button>
      </template>
      <a-form-model :model="form" ref="form1" :rules="rules">
        <a-row>
          <a-col :md="12" :sm="12">
            <a-form-model-item
              label="当月计划产值(万)"
              :labelCol="{ lg: { span: 5 }, sm: { span: 5 } }"
              :wrapperCol="{ lg: { span: 18 }, sm: { span: 18 } }"
              prop="planGrossOutput"
            >
              <BaseInputNumber
                :min="-10000"
                :max="10000"
                v-model="form.planGrossOutput"
                placeholder="请输入"
              ></BaseInputNumber>
            </a-form-model-item>
          </a-col>
          <a-col :md="12" :sm="12">
            <a-form-model-item
              label="当月实际产值(万)"
              :labelCol="{ lg: { span: 5 }, sm: { span: 5 } }"
              :wrapperCol="{ lg: { span: 18 }, sm: { span: 18 } }"
              prop="realGrossOutput"
            >
              <BaseInputNumber
                :min="-10000"
                :max="100000"
                v-model="form.realGrossOutput"
                placeholder="请输入"
              ></BaseInputNumber>
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :md="12" :sm="12">
            <a-form-model-item
              label="当月确权产值(万)"
              :labelCol="{ lg: { span: 5 }, sm: { span: 5 } }"
              :wrapperCol="{ lg: { span: 18 }, sm: { span: 18 } }"
              prop="authenticRightGrossOutput"
            >
              <BaseInputNumber
                :min="-10000"
                :max="100000"
                v-model="form.authenticRightGrossOutput"
                placeholder="请输入"
              ></BaseInputNumber>
            </a-form-model-item>
          </a-col>
          <a-col :md="12" :sm="12">
            <a-form-item
              label="记录人"
              :labelCol="{ lg: { span: 5 }, sm: { span: 5 } }"
              :wrapperCol="{ lg: { span: 18 }, sm: { span: 18 } }"
            >
              <BaseInput v-model="form.creater" disabled></BaseInput>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :md="12" :sm="12">
            <a-form-item
              label="记录时间"
              :labelCol="{ lg: { span: 5 }, sm: { span: 5 } }"
              :wrapperCol="{ lg: { span: 18 }, sm: { span: 18 } }"
            >
              <BaseInput v-model="form.createTime" disabled></BaseInput>
            </a-form-item>
          </a-col>
        </a-row>
      </a-form-model>
    </a-modal>
  </div>
</template>

<script>
import { getOutputValueDetails, getProjectOutputValueInfo, addOutputValue } from '@/api/project/productionRecords'
export default {
  name: 'MontnOutputValue',
  props: ['isDetails'],
  data() {
    const columns = [
      {
        title: '序号',
        width: 65,
        scopedSlots: { customRender: 'serial' }
      },
      {
        title: '月份',
        dataIndex: 'month'
      },
      {
        title: '当月项目人数',
        dataIndex: 'projectPeopleNumber'
      },
      {
        title: '当月计划产值(万)',
        dataIndex: 'planGrossOutput'
      },
      {
        title: '当月计划人均产值(万)',
        dataIndex: 'planPerCapita'
      },
      {
        title: '当前实际产值(万)',
        dataIndex: 'realGrossOutput'
      },
      {
        title: '当前实际人均产值(万)',
        dataIndex: 'realPerCapita'
      },
      {
        title: '当前确权产值(万)',
        dataIndex: 'authenticRightGrossOutput'
      },
      {
        title: '当前确权人均产值(万)',
        dataIndex: 'authenticRightPerCapita'
      },
      {
        title: '记录人',
        dataIndex: 'creatName'
      },
      {
        title: '记录时间',
        dataIndex: 'creatDate'
      },
      {
        title: '操作',
        dataIndex: 'action',
        width: '200px',
        fixed: 'right',
        scopedSlots: { customRender: 'action' }
      }
    ]

    const columnsDetails = [
      {
        title: '序号',
        width: 65,
        scopedSlots: { customRender: 'serial' }
      },
      {
        title: '月份',
        dataIndex: 'month'
      },
      {
        title: '当月项目人数',
        dataIndex: 'projectPeopleNumber'
      },
      {
        title: '当月计划产值(万)',
        dataIndex: 'planGrossOutput'
      },
      {
        title: '当月计划人均产值(万)',
        dataIndex: 'planPerCapita'
      },
      {
        title: '当前实际产值(万)',
        dataIndex: 'realGrossOutput'
      },
      {
        title: '当前实际人均产值(万)',
        dataIndex: 'realPerCapita'
      },
      {
        title: '当前确权产值',
        dataIndex: 'authenticRightGrossOutput'
      },
      {
        title: '当前确权人均产值',
        dataIndex: 'authenticRightPerCapita'
      },
      {
        title: '记录人',
        dataIndex: 'creatName'
      },
      {
        title: '记录时间',
        dataIndex: 'creatDate'
      }
    ]
    return {
      queryParam: {
        outputValueId: ''
      },
      columns,
      columnsDetails,
      titles: '产值信息',
      // 加载数据方法 必须为 Promise 对象
      loadData: (parameter) => {
        this.queryParam.outputValueId = this.$route.query.id
        const requestParameters = Object.assign({}, parameter, this.queryParam)
        return getProjectOutputValueInfo(requestParameters).then((res) => {
          return res
        })
      },
      form: {}
    }
  },

  watch: {},

  components: {},

  computed: {},

  created() {},

  mounted() {},

  methods: {
    handleRecord(e) {
      // 产值信息
      this.visible = true
      this.form = {}
      ;(this.form.creater = JSON.parse(sessionStorage.getItem('ycloud-user_info')).name),
        (this.form.createTime = this.getNowDate())
      this.form.id = e.id
    }
  }
}
</script>
<style lang='scss' scoped>
</style>